import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { resolve } from 'path';
import AutoImport from 'unplugin-auto-import/vite';
import VitePluginImageTools from 'vite-plugin-image-tools';

// https://vite.dev/config/
export default defineConfig({
	plugins: [
		react(),
		AutoImport({
			imports: [
				'react',
				'react-router-dom',
				/* 'react-i18next', */ 'ahooks',
				{
					'react-redux': ['useSelector', 'useDispatch'],
					'@reduxjs/toolkit': ['createSlice', 'configureStore'],
				},
			], // 可以选择自动导入模块
			// dirs: ['src/hooks', 'src/utils'], // 指定生成自动导入文件的位置
			dts: './.auto-imports.d.ts', // 生成自动导入类型声明文件
			eslintrc: {
				enabled: true, // 生成eslint插件配置文件
				filepath: './.eslintrc-auto-import.json',
			},
		}),
		VitePluginImageTools({
			quality: 80,
			enableWebp: true,
			enableDev: true,
			enableDevWebp: true,
		}),
	],
	resolve: {
		alias: {
			// eslint-disable-next-line no-undef
			'@': resolve(__dirname, './src'),
		},
	},
	css: {
		preprocessorOptions: {
			scss: {
				additionalData: `
				@use "@/assets/styles/common.scss" as *;
				@use "@/assets/styles/variable.scss" as *;
				`,
			},
		},
	},
	server: {
		port: 3005,
		host: '0.0.0.0',
	},
	esbuild: {
		// drop: ['console']
	},
	build: {
		minify: true,
		cssCodeSplit: true,
		sourcemap: false,
		rollupOptions: {
			input: {
				main: 'index.html',
			},
			output: {
				chunkFileNames: 'static/js/[name]-[hash].js',
				entryFileNames: 'static/js/[name]-[hash].js',
				assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
				manualChunks(id) {
					if (id.includes('node_modules')) {
						return id
							.toString()
							.split('node_modules/')[1]
							.split('/')[0]
							.toString();
					}
				},
			},
		},
	},
});
